<template>
  <view class="bg">
    <view class="bolder font20 txt-center title mb20">精品咖啡沙龙</view>
    <view class="icarous-bg mb30">
      <Icardous class="icardous"></Icardous>
    </view>
    <view class="get-way flex-center mb-50">
      <view class="way-item flex-center-center" @click="choseTakeType(0)">
        <view class="txt-center">
          <img src="../../static/img/shop.png" class="way-img"/>
          <view class="font16">门店自取</view>
          <view class="font12 gray">Store Pick up</view>
        </view>
      </view>
      <view class="vline"></view>
      <view class="way-item"  @click="choseTakeType(1)">
        <view class="txt-center">
          <img src="../../static/img/takeout.png" class="way-img"/>
          <view class="font16">外卖配送</view>
          <view class="font12 gray">Take Out Delivery</view>
        </view>
      </view>
    </view>
    <view class="flex-center padding-lr-20 mb-50">
<!--      <f-auth-btn class="flex-center-center mr-gap vip-item">-->
<!--        <view class="flex-center">-->
<!--          <img src="../../static/img/thrown.png" class="way-img mr10"/>-->
<!--          <view>-->
<!--            <view class="font16">会员中心</view>-->
<!--            <view class="font12 gray">Member Center</view>-->
<!--          </view>-->
<!--        </view>-->
<!--      </f-auth-btn>-->
      <f-auth-btn class="flex-center-center vip-item">
        <view class="flex-center">
          <img src="../../static/img/lihe.png" class="way-img mr10"/>
          <view>
            <view class="font16">充值有礼</view>
            <view class="font12 gray">CHong aaa</view>
          </view>
        </view>
      </f-auth-btn>
    </view>
<!--    <view class="padding-lr-20 mb-50">-->
<!--      <view class="flex-center order-item">-->
<!--        <img src="../../static/img/milk.png" class="way-img2 mr10"/>-->
<!--        <view class="ml-50">-->
<!--          <view class="font16">我的订单</view>-->
<!--          <view class="font12 gray">Order</view>-->
<!--        </view>-->
<!--      </view>-->
<!--    </view>-->
    <img src="../../static/img/coupon.png" class="coupon"/>
  </view>
</template>

<script>
import {mainData} from "@/pages/cart/components/mainData";
import Icardous from "./icardous.vue";
import FAuthBtn from "@/pages/components/f-auth-btn.vue";
export default {
  components: {Icardous,FAuthBtn},
  data() {
    return {
      value1: 0
    }
  },
  onLoad() {

  },
  methods: {
    click1(e) {

    },
		choseTakeType(index){
			mainData.cartData.takeType = index;
			uni.switchTab({
				url: '/pages/cart/index',
					success: () => {
						console.log('跳转成功');
					},
					fail: (err) => {
						console.error('跳转失败', err);
			    }
			});
		}
  }
}
</script>

<style lang="scss" scoped>
.bg{
  padding-bottom: 50rpx;
}
.ml-50{
  margin-left: 50rpx;
}
.padding-lr-20{
  padding: 0 20rpx;
}
.order-color{
  color: #FFE4A5;
}
.title {
  margin-top: 150rpx;
}
.way-img{
  width: 70rpx;
  height: 70rpx;
}
.way-img2{
  width: 100rpx;
  height: 100rpx;
}
.mr-gap{
  margin-right: 40rpx;
}
.icarous-bg {
  border-radius: 20rpx;
  overflow: hidden;
  height: 750rpx;
  margin-bottom: 50rpx;
  .icardous {
    width: 100%;
    height: 400rpx;
  }
}
.mb-50{
  margin-bottom: 50rpx;
}
.get-way{
  margin-left: 20rpx;
  margin-right: 20rpx;
  height: 270rpx;
  background-color: white;
  border-radius: 20rpx;
  box-shadow: 0 0 8rpx 8rpx #EAEAEA;
  .way-item{
    flex: 1;
  }
  .vline{
    border-right: 1rpx solid #EAEAEA;
    height: 75%;
    margin-top: 20rpx;
    margin-bottom: 20rpx;
  }
}
.vip-item{
  flex:1;
  border-radius: 20rpx;
  padding: 40rpx 0;
  background-color: white;
  box-shadow: 0 0 8rpx 8rpx #EAEAEA;
}
.order-item{
  border-radius: 20rpx;
  padding: 40rpx;
  box-shadow: 0 0 8rpx 8rpx #EAEAEA;
}
.coupon{
  width: 710rpx;
  height: 192rpx;
  margin-left: 20rpx;
}
</style>
